<template>
  <img :src="src" :style="style" alt="avatar" />
</template>
<script setup>
import { computed } from 'vue'

const props = defineProps({
  src: {
    type: String,
    required: false
  },
  size: {
    type: [Number, String],
    default: 50
  },
  round: {
    type: [Number, String],
    default: 5
  }
})
const style = computed(() => {
  return {
    width: `${props.size}px`,
    height: `${props.size}px`,
    'border-radius': `${props.round}px`
  }
})
</script>

<style scoped>
img {
  cursor: pointer;
}
</style>
